<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Diboot 开发助理 专业版</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta content="width=device-width, initial-scale=1" name="viewport"/>
    <meta content="Diboot轻代码开发平台" name="keywords"/>
    <meta content="高质量、高效率、智能化的软件开发平台" name="description"/>
    <meta content="苏州帝博信息技术有限公司 - www.dibo.ltd" name="author"/>
    <link href="https://devtools.diboot.com/cdn/v1/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="https://devtools.diboot.com/cdn/v1/adminlte.min.css" rel="stylesheet" type="text/css"/>
    <link href="https://devtools.diboot.com/cdn/v1/toastr.min.css" rel="stylesheet" type="text/css"/>
    <link href="https://devtools.diboot.com/cdn/v1/datepicker.min.css" rel="stylesheet" type="text/css"/>
    <link href="https://devtools.diboot.com/cdn/v1/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="https://devtools.diboot.com/cdn/v1/pace.min.css" rel="stylesheet"/>
    <link rel="shortcut icon" href="https://www.diboot.com/favicon.ico"/>
    <style>.toast-top-center {
        top: 80px !important;
        right: 0;
        width: 100%
    }

    section.content {
        padding: 8px;
        border-radius: 0px;
        border-top-width: 1px;
        margin-bottom: 10px;
    }

    section.content .box {
        padding: 5px;
        margin-bottom: 10px;
    }

    section.content .box-title {
        font-size: 14px;
    }

    section.content .box-body {
        padding: 4px 6px;
    }

    .col-md-10 .table, .table-responsive .table {
        margin-bottom: 5px;
    }

    section.content .btn-app.primary {
        background-color: #F0FFFF;
    }

    section.content .btn-app.primary:hover {
        color: #fff;
        background-color: #008d4c;
    }

    .box-header {
        padding: 8px;
    }

    .col-operation {
        min-width: 150px;
    }

    section.content .btn-reset {
        height: 30px;
        padding: 5px;
        font-size: 12px;
    }

    .col-md-1 {
        padding: 0 5px;
    }

    .form-control {
        padding: 4px;
        min-width: 120px;
    }

    label {
        font-weight: 500;
    }

    select.custom {
        width: 80px;
        height: 34px;
        border: 1px solid #E1E1E1;
    }

    select.form-control {
        border-color: #E1E1E1;
    }

    input[type="checkbox"] {
        width: 15px;
        height: 15px;
    }

    .checkbox {
        margin-top: 2px;
        margin-bottom: 6px;
    }

    input.form-input {
        margin-top: 9px;
        padding-left: 4px;
        padding-right: 4px;
    }

    td div.row {
        margin-left: 0;
        margin-right: 0;
        padding: 4px 2px;
        border-bottom: 1px dashed #e0e0e0;
    }

    .table-striped > tbody > tr:nth-of-type(2n) {
        background-color: #f2feff;
    }

    .sub-options label {
        width: 50px;
    }

    .table > tbody > tr > td.valign-center {
        font-weight: 600;
        vertical-align: center;
    }

    .table > tbody > tr > td label.valign-center {
        padding-top: 6px;
    }

    .table > tbody > tr > td {
        padding: 2px 6px;
    }

    .div-columnBox {
        position: relative;
    }

    .div-columnBody {
        width: 100%;
        max-height: 200px;
        overflow: auto;
        padding: 4px 8px;
        position: absolute;
        z-index: 101;
        background-color: #d0e5ef;
        border-radius: 5px;
    }

    .div-columnBody-modal {
        width: 100%;
        max-height: 200px;
        overflow: auto;
        padding: 4px 8px;
        position: absolute;
        z-index: 101;
        background-color: #f6faec;
    }

    .div-column {
        border-bottom: dashed 1px #333;
        cursor: pointer;
        padding: 4px 0;
    }

    .div-column:last-child {
        border-bottom: none;
    }

    .div-drag {
        padding-right: 0;
    }

    .div-drag .alert {
        width: 80px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding: 4px 5px;
        margin-top: 4px;
        margin-right: 5px;
        cursor: move;
        margin-bottom: 0;
        color: #333 !important;
        border-color: #aad5e0;
        background-color: #d2f2f6 !important;
    }

    @keyframes fadeInRight {
        from {
            opacity: 0;
            transform: translate3d(100%, 0, 0);
        }
        to {
            opacity: 1;
            transform: none;
        }
    }

    .fadeInRight {
        animation: fadeInRight .5s;
        -webkit-animation: fadeInRight .5s;
    }

    .border-b {
        border-bottom: solid 1px #ccc;
        padding-bottom: 5px;
    }

    #msgWrapper {
        width: 400px;
        margin: 15px auto;
    }

    #msgWrapper a, #msgWrapper a.info {
        color: #fff;
    }

    #msgWrapper a.warn {
        color: orange;
    } </style>
</head>
<body class="hold-transition skin-green sidebar-collapse sidebar-mini">
<div class="wrapper">
    <header class="main-header">
        <a href="https://www.diboot.com" target="_blank" class="logo"><span class="logo-mini"><b>D</b>ibo</span><span
                class="logo-lg"><b>D</b>iboot 开发助理</span></a>
        <nav class="navbar navbar-static-top">
            <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button"><span class="sr-only">Toggle navigation</span><span
                    class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></a>
            <div id="msgWrapper"></div>
        </nav>
    </header>
    <aside class="main-sidebar">
        <section class="sidebar">
            <ul class="sidebar-menu" data-widget="tree">
                <li class="header">开发工具</li>
                <li><a href="/demo/maintain/table.html"><i class="fa fa-database"></i> <span>管理 数据库表</span></a></li>
                <li><a href="/demo/maintain/sql.html"><i class="fa fa-bolt"></i> <span>执行 SQL语句</span></a></li>
                <li class="active"><a href="/demo/generate/crud.html"><i
                        class="fa fa-cube"></i><span>生成 CRUD功能</span></a></li>
                <li><a href="/demo/generate/import.html"><i class="fa fa-upload"></i> <span>生成 Excel导入功能</span></a></li>
                <li><a href="/demo/generate/export.html"><i class="fa fa-download"></i><span>生成 导出到Excel功能</span></a>
                </li>
                <li><a href="/demo/generate/report.html"><i class="fa fa-bar-chart"></i> <span>生成 统计图表功能</span></a></li>
            </ul>
        </section>
    </aside>
    <div class="content-wrapper" id="app">
        <section class="content">
            <div class="box">
                <div class="box-header with-border">
                    <h5 class="box-title" style="font-size:16px"><i class="fa fa-cube"></i> 生成 CRUD功能
                        <small>(上方区域配置功能选项, 下方区域预览生成效果)</small>
                    </h5>
                    <div class="box-tools pull-right" style="top:2px">
                        <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                class="fa fa-minus"></i> 收起/展开
                        </button>
                    </div>
                </div>
                <div class="box-body">
                    <div class="row">
                        <div class="col-md-10" style="padding-right: 0">
                            <table class="table table-striped">
                                <tbody>
                                <!--我要生成-->
                                <tr>
                                    <td width="90px" class="valign-center"><label
                                            class="valign-center"><b>我要生成</b></label></td>
                                    <td>
                                        <div class="row">
                                            <div class="col-md-2">
                                                <select v-model="config.model.table" @change="choiceTable" name="entity"
                                                        class="form-control">
                                                    <option value="">- 哪个实体对象的 -</option>
                                                    <option v-for="entity in entityList" :value="entity.tableName">
                                                        <!--{{entity | formatTableOptions}}-->
                                                        {{entity.tableName}}【{{entity.objName}}】
                                                    </option>
                                                </select>
                                                <input v-model="config.model.label" name="label"
                                                       class="form-control form-input" placeholder="实体中文名"/>
                                            </div>
                                            <div class="col-md-10">
                                                <ul>
                                                    <li><label><input type="checkbox" v-model="config.layers"
                                                                      value="View"/>前端页面 ( <select
                                                            v-model="config.subpageOpenType" title="选择子页面的打开方式">
                                                        <option value="Redirect">子页跳转</option>
                                                        <option value="Dialog">子页弹出</option>
                                                    </select>， <select v-model="config.layoutColumnSize"
                                                                       title="选择子页面的布局方式">
                                                        <option value="1">子页1列布局</option>
                                                        <option value="2">子页2列布局</option>
                                                    </select>) </label></li>
                                                    <li>
                                                        <div class="checkbox">
                                                            <label style="width: 90px"><input type="checkbox"
                                                                                              v-model="config.layers"
                                                                                              value="Controller"/>
                                                                Controller </label>
                                                            <span v-if="config.layers.indexOf('Controller') &gt; -1"
                                                                  class="sub-options">( 包含: <label><input
                                                                    type="checkbox" v-model="config.functions"
                                                                    value="C"/> 增 </label><label><input type="checkbox"
                                                                                                        v-model="config.functions"
                                                                                                        value="D"/> 删 </label><label><input
                                                                    type="checkbox" v-model="config.functions"
                                                                    value="U"/> 改 </label><label><input type="checkbox"
                                                                                                        v-model="config.functions"
                                                                                                        value="R"/> 查 </label><label><input
                                                                    type="checkbox" v-model="config.functions"
                                                                    value="L"/> 列表 </label><label><input type="checkbox"
                                                                                                         v-model="config.functions"
                                                                                                         value="Batch"
                                                                                                         title="支持勾选记录后操作类的功能"/> 勾选 </label><label><input
                                                                    type="checkbox" v-model="config.functions"
                                                                    value="Export"
                                                                    title="支持查询结果导出到Excel的功能"/> 导出 </label>) </span>
                                                        </div>
                                                    </li>
                                                    <li>
                                                        <div class="checkbox">
                                                            <label><input type="checkbox" v-model="config.layers"
                                                                          value="Common" title="重新生成基础代码（覆盖已有代码）"/> 基础代码
                                                                (Model,Service,Mapper ) </label>
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                <!--配置菜单-->
                                <tr>
                                    <td><label class="valign-center"><input type="checkbox" v-model="checkMenu"
                                                                            value="true"/><b>配置菜单</b></label></td>
                                    <td>
                                        <div class="row">
                                            <!--上级菜单-->
                                            <div class="col-md-2">
                                                <select name="menuParentId" class="form-control"
                                                        v-model="depositMenu['parentId']">
                                                    <option value="0">- 上级菜单 -</option>
                                                    <option v-for="menu in menus" :value="menu.id">{{ menu.name }}
                                                    </option>
                                                </select>
                                            </div>
                                            <!--新建上级菜单-->
                                            <label class="valign-center col-md-1" style="margin-left: -15px">
                                                <button type="button" title="新建上级菜单" data-toggle="modal"
                                                        data-target="#menuModal" class="btn btn-sm btn-default"
                                                        style="padding:2px 6px"><i class="fa fa-plus"></i></button>
                                            </label>
                                            <!--菜单名称-->
                                            <div class="col-md-3">
                                                <input placeholder="菜单名称" v-model="depositMenu['name']"
                                                       class="form-control" type="text"/>
                                            </div>
                                            <!--选择图标-->
                                            <div class="col-md-3">
                                                <div class="input-group">
                                                    <input id="icon-id" placeholder="菜单图标 (fa fa-icon)"
                                                           class="form-control" type="text"
                                                           v-model="depositMenu['icon']"/>
                                                    <span title="选择图标" class="input-group-addon" @click="showModal"
                                                          style="cursor: pointer;">选择</span>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                        <!--重置和生成按钮-->
                        <div class="col-md-2">
                            <a class="btn btn-app btn-reset" href="/demo/generate/crud.html">重置 </a>
                            <br/>
                            <br/>
                            <button class="btn btn-app primary" @click="submit"><i class="fa fa-arrow-circle-right"></i>
                                生成
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal fade" id="iconModal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header" style="padding: 8px 15px">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                    aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title">选择图标</h4>
                        </div>
                        <div class="modal-body" style="height: 500px;overflow: auto; padding:0px 15px 5px 15px">
                            <h5>Web应用图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in webicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>手势图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in handicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>交通图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in trafficicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>性别图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in sexicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>文件图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in fileicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>旋转图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in xicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>支付图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in payicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>图表图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in charticon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>货币图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in moneyicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>文本编辑图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in editicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>定向图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in dicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>播放图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in playicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>品牌图标</h5>
                            <div class="row text-center border-b">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in brandicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                            <h5>医疗图标</h5>
                            <div class="row text-center" style="margin-bottom: 15px">
                                <div class="col-md-1" data-dismiss="modal" v-for="list in medicalicon">
                                    <i :class="list" @click="getClass(list)" style="cursor: pointer"></i>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal fade in" id="menuModal">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" data-dismiss="modal" aria-label="Close" class="close"><span
                                    aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title">新建上级菜单</h4>
                        </div>
                        <div class="modal-body">
                            <form class="form-horizontal">
                                <div class="form-group">
                                    <label class="col-md-3 control-label">菜单名称 <span
                                            style="color: #f00">*</span></label>
                                    <div class="col-md-8">
                                        <input class="form-control" v-model="newMenu.name" placeholder="菜单名称"/>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-md-3 control-label">菜单图标 <span
                                            style="color: #f00">*</span></label>
                                    <div class="col-md-8">
                                        <div class="div-columnBox text-center" @mouseover="isShowMenuIcon = true"
                                             @mouseleave="isShowMenuIcon = false">
                                            <input type="text" readonly="" placeholder="菜单图标 (fa fa-icon)"
                                                   class="form-control" v-model="newMenu.icon"/>
                                            <div class="div-columnBody-modal" v-if="isShowMenuIcon">
                                                <div class="col-md-1" v-for="list in webicon">
                                                    <i :class="list" @click="getNewMenuIcon(list)"
                                                       style="cursor: pointer"></i>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="modal-footer">
                            <div class="col-md-10 col-md-offset-1">
                                <button type="button" class="btn btn-default pull-left" data-dismiss="modal"> 取 消
                                </button>
                                <button type="button" class="btn btn-primary" :disabled="!newMenu.name || !newMenu.icon"
                                        @click="addNewMenu"> 确认添加
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
</div>
<script type="text/javascript" src="https://devtools.diboot.com/cdn/v1/jquery.min.js"></script>
<script type="text/javascript" src="https://devtools.diboot.com/cdn/v1/bootstrap.min.js"></script>
<script type="text/javascript" src="https://devtools.diboot.com/cdn/v1/adminlte.min.js"></script>
<script type="text/javascript" src="https://devtools.diboot.com/cdn/v1/toastr.min.js"></script>
<script src="https://devtools.diboot.com/cdn/v1/vue.min.js"></script>
<script type="text/javascript" src="https://devtools.diboot.com/cdn/v1/datepicker.min.js"></script>
<script type="text/javascript" src="https://devtools.diboot.com/cdn/v1/pace.min.js"></script>
<script type="text/javascript" src="https://devtools.diboot.com/loader/js/1.6.0?f=web/js/templates.generate.crud.js&amp;lcs=C4LqfUblTILA6G5cbjQmbaBFRbenzFJtb3FXKP5/gQyUbQzZKRkPKOMv%2BDnRxRYlj5MDY0RddZ%2BmiTrJ5GT%2BaUl7KPk8bgdv%2BDEI5O%2BbfG3A8beHVwQAM75gqKreYmhq"></script>
<script src="../static/generate/crud.js" ></script>
<script>
    var trueValue=1;
    var falseValue=0;
    var contextPath = "";
    $(document).ready(function () {
        $.get(contextPath + '/diboot/devtools/v1/common/updateCheck', function (res) {
            if (res.code == 0 && res.data) {
                var ahref = res.data.url || "#";
                var title = res.data.title || "";
                var type = res.data.type || "";
                $("#msgWrapper")("<a href='" + ahref + "' class='" + type + "' target='_blank'>" + title + "</a>");
            }
        });
    });
</script>
</body>
</html>